<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>新品有戏后台管理</title>
    <script src="__JS__/jquery.js"></script>
    <link href="__CSS__/boot.css" rel="stylesheet">
    <link href="__STATIC__/layui/css/layui.css" rel="stylesheet">
    <script src="__JS__/layer/layer.js"></script>
    <script src="__STATIC__/layui/layui.js"></script>
    <script src="__STATIC__/boot/js/bootstrap-table.js"></script>
    <script src="__STATIC__/boot/js/bootstrap-table-zh-CN.min.js"></script>
    <script src="__STATIC__/boot/js/dropdown.js"></script>
    <link rel="stylesheet" href="__STATIC__/boot/css/bootstrap-table.min.css"/>
</head>
<body>
{include file="base/header" /}
<div style="height:5px;"></div>
<div style="margin-top: -10px">
    <div class="navbar-form navbar-left" role="search"  >
        <div style="float: left">
            <input type="text" id="title" name="title" required  lay-verify="required" placeholder="请输入商品名称或条形码" autocomplete="off" class="layui-input">
        </div>
        <div class="form-group">
            <button class="layui-btn layui-btn-warm" id="recovery">批量恢复</button>
            <button class="layui-btn layui-btn-danger" id="delete">批量删除</button>
        </div>
    </div>
    <table id="tablelist"></table>
</div>
</body>
<script>
    $('#tablelist').bootstrapTable({
            //获取行号
            onClickRow: function(row, $element) {
                indexs = $element.data('index');
                //console.log(row);
            },
            language: 'zh-CN',
            autoclose: true,
            todayHighlight: true,
            striped: true,//设置为 true 会有隔行变色效果
            method: 'get',//服务器数据的请求方式 'get' or 'post'
            url: "{:url('index/delete/getInfo')}",//服务器数据的加载地址
            //contentType: "application/x-www-form-urlencoded",//发送到服务器的数据编码类型
            toolbar:'#toolbar',//
            //selectItemName:'checkbox',
            //search:'true',//
            searchText:'',//搜索字段
            trimOnSearch:'true',//搜索时去掉空格
            searchOnEnterKey:true,
            sortName:'ID',//排序字段
            sortOrder : 'desc',//降序
            //showToggle: 'true',//是否显示 切换试图（table/card）按钮
            // showColumns: 'true',//是否显示 内容列下拉框
            //showRefresh:"false",//刷新
            sidePagination: "server",   //分页方式：client客户端分页，server服务端分页（*）
            pagination: 'false',//设置为 true 会在表格底部显示分页条
            //clickToSelect:'true',//设置true 将在点击行时，自动选择rediobox 和 checkbox
            //singleSelect:'true',//设置True 将禁止多选
            pageSize: '20',//如果设置了分页，页面数据条数
            pageList:[20,40],
            smartDisplay:false,
            //得到查询的参数
            queryParams : function (params) {
                //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
                var temp = {
                    rows: params.limit,                         //页面大小
                    page: (params.offset / params.limit) + 1,   //页码
                    //sort: params.sort,      //排序列名
                    //sortOrder: params.order,//排位命令（desc，asc）
                    title:$("input[name=title]").val()
                };
                return temp;
            },
            columns: [
                {title:'请选择',align:'center',checkbox : true},
                {field: 'id', title: 'ID', align:'center'},
                {field: 'barcode', title: '条形码', align:'center'},
                {field: 'pname', title: '商品名称', align:'center'}
            ]
        }
    );

    //批量恢复
    $("#recovery").click(function () {
        layer.confirm('你确定要恢复吗?',{bnt:['确定','取消']},function () {
            var id = [];
            var data = $("#tablelist").bootstrapTable('getSelections');

            for(var i=0;i<data.length;i++){
                id.push(data[i].id);
            }

            if(id.length == 0){
                layer.msg('请选择需要恢复的商品',{icon:5,time:2000});
                return;
            }
            $.ajax({
                url:"{:url('index/delete/recovery')}",
                data:"id="+id,
                type:"post",
                dataType:"json",
                success:function (res) {
                    if(res.success){
                        layer.msg(res.success,{icon:1,time:2000},function () {
                                $("#tablelist").bootstrapTable(('refresh'));
                            }
                        );
                    }else{
                        layer.msg(res.error,{icon:5,time:2000});
                    }
                }
            });
        });
    });
    //批量删除
    $("#delete").click(function () {
        layer.confirm('你确定要删除吗?数据不可恢复',{bnt:['确定','取消']},function () {
            var id = [];
            var data = $("#tablelist").bootstrapTable('getSelections');

            for(var i=0;i<data.length;i++){
                id.push(data[i].id);
            }

            if(id.length == 0){
                layer.msg('请选择需要恢复的商品',{icon:5,time:2000});
                return;
            }
            $.ajax({
                url:"{:url('index/delete/delete')}",
                data:"id="+id,
                type:"post",
                dataType:"json",
                success:function (res) {
                    if(res.success){
                        layer.msg(res.success,{icon:1,time:2000},function () {
                                $("#tablelist").bootstrapTable(('refresh'));
                            }
                        );
                    }else{
                        layer.msg(res.error,{icon:5,time:2000});
                    }
                }
            });
        });
    });
    //输入框发生改变
    $("#title").change(function () {
        $("#tablelist").bootstrapTable(('refresh'));
    });
</script>
</html>